<!-- #layout name=blank --sideType='market'-->
<div class="page-header">
    <h1 class="title">Apps</h1>
</div>
<div data-bind="component: { name: 'kb-breadcrumb', params:[{
    name: 'MARKET'
},{
    name: Kooboo.text.common.Apps
}]}"></div>

<div class="template-list row clearfix" data-bind="foreach: { data: apps, afterRender: appsRendered }">
    <div class="col-md-3">
        <a href="javascript:;" class="thumbnail" data-bind="click: $parent.onSelectApp">
            <span class="wrapper">
                <img alt="thumbnail" class="lazy" data-bind="attr: { 'data-original': $data.thumbNail,alt: $data.name }">
                <span data-bind="text: $data.description" class="desc"></span>
            </span>
            <div class="caption">
                <strong data-bind="text: $data.name"></strong>
            </div>
        </a>
    </div>
</div>
<div data-bind="component: { name: 'kb-pager', params: pager }"></div>
<kb-template-modal params="isShow: showTemplateModal, data: appData"></kb-template-modal>

<script>
    (function() {
        Kooboo.loadJS([
            "/_Admin/Scripts/components/kbBreadcrumb.js",
            "/_Admin/Scripts/components/kbPager.js",
            "/_Admin/Scripts/components/kbTemplateModal.js",
            "/_Admin/Scripts/lib/jquery.lazyload.min.js"
        ])
    })()
</script>
<script src="/_Admin/View/Market/Scripts/Kooboo.Market.js"></script>
<script src="/_Admin/View/Market/App/Index.js"></script>